<template>
	<view class="contents">
		<view class="yj">
			<view class="yjwt">
				您的问题
			</view>
			<!-- 输入框 -->
			<view class="yjinput">
				<textarea class="inp-area" v-model="model.content" name="message" placeholder="请填写问题描述以便我们提供更好的帮助..."
					placeholder-class="pl-style" />

			</view>
			<!-- 上传图片 -->
			<u-upload
				:upload-text="null"
				:showProgress="false"
				@on-uploaded="uploadSuccess"
				@on-remove="uploadRemove"
				action="http://hzsp.8.lwsite.cn//addons/shopro/index/upload"
				width="140"
				height="140"
				maxCount="9"
			></u-upload>
			<!-- 提交按钮 -->
			<view class="sumit" @click="addFeedback">
				确认提交
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				value1: "", //文本域内容
				fileList1: [], //上传图片
				model: {
					type: 'feedback',
					content: '',
					phone: '',
					images: []
				},
			}
		},
		methods: {
			// 上传图片成功
			uploadSuccess(e) {
				
				this.model.images = [];
				e.forEach(item => {
					this.model.images.push(item.response.data.url);
				});
			},
			
			// 移除图片
			uploadRemove(index) {
				this.model.images.splice(index, 1);
			},
			// 提交意见
			addFeedback() {
				let that = this;
				that.$http('other.feedbackAdd', that.model, '提交中...').then(res => {
					uni.hideKeyboard();
					if (res.code === 1) {
						that.$u.toast('提交成功');
						that.$Router.back();
					}
				});
			}
		}
	}
</script>

<style scoped>
	.yj {
		background: #FFFFFF;
		box-shadow: 0rpx 3rpx 21rpx 0rpx rgba(0, 0, 0, 0.07);
		border-radius: 6rpx;
		padding: 30rpx 20rpx 200rpx;
		height: calc(100vh - 38rpx);
	}

	.contents {
		padding: 20rpx;
	}

	.yjwt {
		position: relative;
		padding-left: 19rpx;
		width: calc(100% - 19rpx);

	}

	.yjwt::after {
		content: "";
		position: absolute;
		width: 10rpx;
		height: 30rpx;
		background: #FF9A33;
		left: 0;
		top: 50%;
		transform: translate(0, -50%);
	}

	.yjinput {
		margin: 30rpx 0;		
		border: 1px solid #999999;
		border-radius: 10rpx;
		padding:  20rpx;
		height: 412rpx;
	}
	.yjinput textarea{
		width: 100%;
	}
	.sumit {
		width: 500rpx;
		height: 80rpx;
		background: #FF9A33;
		border-radius: 40rpx;
		margin: 197rpx auto 0;
		text-align: center;
		line-height: 80rpx;
		font-size: 36rpx;
		font-weight: 500;
		color: #FFFFFF;
	}

	.pl-style {
		font-size: 26rpx;

		color: rgba(177, 179, 199, 1);
	}
</style>
